<!-- subpkg_consult/description/index.vue -->
<script setup>
	import { computed, ref } from 'vue'
	import { storeToRefs } from 'pinia'
	import { useConsultStore } from '@/stores/consult'

	// 病情相关的数据
	const { illnessInfo, initalValue } = storeToRefs(useConsultStore())
	// 接收地址的参数
	const props = defineProps({
		type: String,
		illnessType: String,
		depId: String,
	})
	// 患病时长
	const illnessTimes = [
		{ value: 1, text: '一周内' },
		{ value: 2, text: '一月内' },
		{ value: 3, text: '半年内' },
		{ value: 4, text: '半年以上' },
	]
	const consultFlags = [
		{ value: 1, text: '就诊过' },
		{ value: 0, text: '没有就诊过' },
	]
	const isNext = computed(() => {
		return (
			illnessInfo.value.illnessDesc !== '' &&
			illnessInfo.value.illnessTime !== '' &&
			illnessInfo.value.consultFlag !== ''
		)
	})
	if (illnessInfo.value.illnessDesc) {
		uni.showModal({
			title: '温馨提示',
			content: '是否恢复之前填写的病情信息？',
			confirmText: '确认',
			confirmColor: '#16C2A3',
			cancelColor: '#848484',
			success({ confirm }) {
				// 清空 Pinia 中记录的数据
				if (!confirm) illnessInfo.value = initalValue.value
			},
		})
	}
	const getNext = () => {
		// / 问诊相关数据
		const consultStore = useConsultStore()
		// 缓存地址参数
		consultStore.type = props.type
		consultStore.illnessType = props.illnessType
		consultStore.depId = props.depId

		// 处理病情相关图片数据（过滤多余的数据）
		const pictures = illnessInfo.value.pictures
		consultStore.illnessInfo.pictures = pictures.map(({ url, uuid }) => {
			return { id: uuid, url }
		})

		// 跳转到下一页
		uni.navigateTo({ url: '/subpkg_consult/patient/patient' })
	}
</script>

<template>
	<scroll-page>
		<view class="description-page">
			<!-- 在线医生 -->
			<view class="doctor-online">
				<image
					src="/static/uploads/doctor-avatar-2.png"
					class="doctor-avatar"
				/>
				<view class="doctor-info">
					<view class="name">在线医生</view>
					<view class="message">
						请描述你的疾病或症状、是否用药、就诊经历，需要我听过什么样的帮助
					</view>
					<view class="tips">
						<text class="iconfont icon-shield"></text>
						内容仅医生可见
					</view>
				</view>
			</view>
			<!-- 患者信息 -->
			<view class="patient-info">
				<view class="description">
					<uni-easyinput
						type="textarea"
						:styles="{ backgroundColor: '#f6f6f6' }"
						:input-border="false"
						v-model="illnessInfo.illnessDesc"
						placeholder-style="font-size: 30rpx; color: #979797"
						placeholder="请详细描述您的病情,病情描述不能为空"
					/>
				</view>

				<view class="title">本次患病多久了？</view>
				<view class="tags">
					<text
						class="tag"
						v-for="(item, index) in illnessTimes"
						:key="item.value"
						:class="{ active: illnessInfo.illnessTime == index + 1 }"
						@click="illnessInfo.illnessTime = item.value"
						>{{ item.text }}</text
					>
				</view>

				<view class="title">此次病情是否去医院就诊过？</view>
				<view class="tags">
					<text
						class="tag"
						v-for="(item, index) in consultFlags"
						:key="item.value"
						:class="{ active: !illnessInfo.consultFlag == index }"
						@click="illnessInfo.consultFlag = item.value"
						>{{ item.text }}</text
					>
				</view>
			</view>
			<!-- 上传图片 -->
			<view class="patient-picture">
				<uni-file-picker
					title="上传病情相关图片 (仅医生可见)"
					limit="8"
					:image-styles="{ width: '160rpx', height: '160rpx' }"
					file-extname="png,jpg,gif,webp"
					v-model="illnessInfo.pictures"
				/>
			</view>
		</view>
		<!-- 下一步操作 -->
		<view class="next-step">
			<button :disabled="!isNext" @click="getNext" class="uni-button">
				下一步
			</button>
		</view>
	</scroll-page>
</template>

<style lang="scss">
	@import './index.scss';
</style>
